<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Hello App Engine</title>
    <script type="text/javascript" src="scripts/jquery-1.5.2.min.js"></script>
    <script>
    function getNames(parm) {
		$.getJSON("regbooth",
			{
		    	tag: parm 		    	
		  	},
			function(data) {
			  $.each(data.names, function(i,item){
			    $("<span/>").html(item.name).appendTo("#images");
			  });
			}
		);
	}
    </script>
    <style>
    	body {
    		font-family:Arial;
    		font-size:14px;
    	}
    </style>
  </head>
  <body style="background: white url(images/BKGRD.png) repeat-x;">
    <div style="margin:0px auto;width:980px;">
    	<div id="header" style="border-bottom:1px solid #CCCCCC;width:980px;height:150px;padding:0px 20px;margin-bottom:40px;">
    		<a style="display:block;width:246px;height:125px;background:no-repeat url(images/Logo.png);float:left;" href="/"></a>
    		<div style="float:right;height:125px;">
    			<a href="#" style="font-weight:bold;color:#333;text-decoration:none;margin-right:5px;font-family:Arial;font-size:14px;">Create Account</a>
    			<b>|</b>
    			<a href="#" style="font-weight:bold;color:#333;text-decoration:none;margin-left:5px;font-family:Arial;font-size:14px;">Login</a>
    			<br /><br /><br />
    			<a href="#" style="display:block;width:161px;height:37px;background:no-repeat url(images/butHost.png);float:right;margin-top:23px;"></a>
    			<br />
    			<span style="float:right;display:block;color:#333333;font-size:12px;margin-top:4px;font-family:Arial;">No Additional Processing Fees!</span>
    		</div>
    	</div>
    	<div id="midSection" style="padding:0px 20px;width:980px;height:300px;">
    		<div style="float:left;">
	    		<span style="font-size:40px;font-weight:bold;font-family:Arial;padding-left: 25px;color:#333333;">FIND YOUR EVENT</span>
	    		<div style="width:421px;height:181px;background:no-repeat url(images/Event_BKGRD.png);padding:30px 40px;margin-top:-11px;">
	    			<a href="#" style="background:no-repeat url(images/dropdownArrow.png) center right;width:180px;display:block;font-size:22px;font-weight:bold;color:white;text-decoration:none;font-family:Arial;margin-bottom:10px;">San Francisco</a>
	    			<input id="" nam="" style="border:3px solid black;padding:5px;width:420px;color:#CCCCCC;" value="Search for your event..." />
	    			<br />
	    			<a href="#" style="width:119px;height:37px;background:no-repeat url(images/butSearch.png);display:block;float:right;margin-top:15px;"></a>
	    		</div>
    		</div>
    		<div style="float:right;text-align:right;">
    			<span style="font-size:26px;font-weight:bold;font-family:Arial;padding-left: 25px;color:#333333;">EVENTS NEARBY</span>
	    		<div>
	    			<span style="font-size:12px;float:left;">4/24/2011</span>
	    			<div style="width:380px;border-bottom:1px solid #ccc;clear:both;"></div>
	    			This is my awesome event<br />
	    			This is my awesome event<br />
	    			<br />
	    			<span style="font-size:12px;float:left;">4/23/2011</span>
	    			<div style="width:380px;border-bottom:1px solid #ccc;clear:both;"></div>
	    			This is my awesome event<br />
	    		</div>
	    		<br /><br />
	    		<span style="font-size:26px;font-weight:bold;font-family:Arial;padding-left: 25px;color:#333333;">FRIEND'S EVENTS</span>
	    		<div>
	    			<span style="font-size:12px;float:left;">4/24/2011</span>
	    			<div style="width:380px;border-bottom:1px solid #ccc;clear:both;"></div>
	    			
	    			<br />
	    			<a href="#" style="background:no-repeat url(images/facebook-connect.png);display:block;width:107px;height:26px;float:right;"></a>
	    		</div>
    		</div>
    	</div>
    	<div style="margin:0px auto;width:836px;">
    		<img src="images/Untitled.png" />
    	</div>
    	<div style="margin:0px auto;width:960px;">
    		<img src="images/Untitled2.png" />
    	</div>
    	<div id="footer" style="padding-top:20px;">
    		<div id="footerText" style="width:700px;color:#333333;font-size:12px;float:left;padding-right:20px;border-right:1px solid #aaa;">
    			<b>RegBooth</b> | sdfdsfdff sf sdf sadf sadf asdf asdf asdf adsf adf afd adf adsf adsf asdf sadf lkadsflkj sadflkj sadflkj sadflkj adsflkj asdflkj sadlfkj adlfkj asdlkfj asdflkjasdlfkj asdlfkjasdlfkj adsflkjad flkjadsflkj adlfkj adsflkjadsf
    		</div>
    		<div id="footerLinks" style="float:right;width:226px;">
    			<ul style="margin:0px;padding:0px;">
    			<li style="background: no-repeat url(images/disc.png) left center;display:block;float:left;padding:0px 10px;"><a href="#" style="color:#333333;text-decoration:none;font-size:12px;font-weight:bold;">Contact</a></li>
    			<li style="background: no-repeat url(images/disc.png) left center;display:block;float:left;padding:0px 10px;"><a href="#" style="color:#333333;text-decoration:none;font-size:12px;font-weight:bold;">About</a></li>
    			<li style="background: no-repeat url(images/disc.png) left center;display:block;float:left;padding:0px 10px;"><a href="#" style="color:#333333;text-decoration:none;font-size:12px;font-weight:bold;">Privacy</a></li>
    			<li style="background: no-repeat url(images/disc.png) left center;display:block;float:left;padding-left:10px;"><a href="#" style="color:#333333;text-decoration:none;font-size:12px;font-weight:bold;">Terms</a></li>
    			</ul>
    		</div>
    	</div>
    </div>
    <div style="clear:both;"></div>
    <table>
      <tr>
        <td><a href="#" onclick="getNames('firstname');">First Names</a></td>        
      </tr>
      <tr>
      	<td><a href="#" onclick="getNames('lastname');">Last Names</a></td>
      </tr>
    </table>
    <div id="images"></div>
  </body>
</html>